<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--
    1/条件渲染指令
        v-if/v-else/v-show
    2/比较v-if与v-show
        如果需要频繁切换v-show较好
-->

<div id="demo">
    <p v-if="ok">成功了</p>
    <p v-else>失败了</p>

    <p v-show="ok">表白成功</p>
    <p v-show="!ok">表白失败</p>

    <button @click="ok = !ok">切换</button>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    const vm = new Vue({
        el:'#demo',
        data:{
            ok:false
        },
        methods:{
        }
    })
</script>
</body>
</html>